<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('新增产品外包往返记录')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal" id="form-add">
            <h4 class="form-header h4">外包产品信息</h4>
            <div class="row">
                <div class="col-sm-12">
                    <button type="button" class="btn btn-white btn-sm" onclick="addRow1()"><i class="fa fa-plus"> 增加</i></button>
                    <button type="button" class="btn btn-white btn-sm" onclick="sub.delRow()"><i class="fa fa-minus"> 删除</i></button>
                    <button type="button" class="btn btn-white btn-sm" onclick="getWipInfo()"><i class="fa fa-plus">获取wip信息</i></button>
                    <button type="button" class="btn btn-white btn-sm" onclick="importOutsourceLot()"><i class="fa fa-plus">导入外包批次</i></button>
                    <div class="col-sm-12 select-table table-striped" style="white-space: nowrap;">
                        <table id="bootstrap-table1"></table>
                    </div>
                </div>
            </div>
            <br />
            <p id="userids"> </p>
            <br />
            <div class="row">
                <div class="col-sm-offset-5 col-sm-10">
                    <button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>保 存</button>&nbsp;
                    <button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭 </button>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var prefix = ctx + "outsource/partoutsourcecomegorecord";
        // 初始化数据, 可以由后台传过来
        var data1 = [
            {
                id: "100",
                lotId: "",
                partType: "",
                partName: "",
                outsourceStep: "",
                outsourceCount: "",
                chipNumber: "",
                issueNotes: "",
                stepName: "",
                stepDesc: "",
                stageId: ""
            }
        ];

        var columns1 = [
            {
                width: 20,
                checkbox: true
            },
            {
                field: 'index',
                align: 'center',
                title: "序号",
                width: 20,
                formatter: function (value, row, index) {
                    var columnIndex = $.common.sprintf("<input type='hidden' name='partOutsourceComegoRecordIndex' value='%s'>", $.table.serialNumber(index));
                    var columnId = $.common.sprintf("<input type='hidden' name='outsourcecomegorecord[%s].id' value='%s'>", index, row.id);
                    return columnIndex + $.table.serialNumber(index) + columnId;
                }
            },
            {
                field: 'lotId',
                align: 'center',
                title: '批号',
                width: 100,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].lotId' value='%s' required>", index, value);
                    return html;
                }
            },
            {
                field: 'outsourceCount',
                align: 'center',
                title: '外包数量',
                width: 10,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].outsourceCount' value='%s' readonly>", index, value);
                    return html;
                }
            },
            {
                field: 'chipNumber',
                align: 'center',
                title: '片号',
                width: 90,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].chipNumber' value='%s'>", index, value);
                    return html;
                }
            },
            {
                field: 'issueNotes',
                align: 'center',
                title: '外包前检验备注',
                width: 100,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].issueNotes' value='%s'>", index, value);
                    return html;
                }
            },
            {
                field: 'partType',
                align: 'center',
                title: '产品类型',
                width: 20,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].partType' value='%s' readonly>", index, value);
                    return html;
                }
            },
            {
                field: 'partName',
                align: 'center',
                title: '产品名称',
                width: 90,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].partName' value='%s' readonly>", index, value);
                    return html;
                }
            },
            {
                field: 'outsourceStep',
                align: 'center',
                title: '外包工步',
                width: 90,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].outsourceStep' value='%s' readonly>", index, value);
                    return html;
                }
            },
            {
                field: 'stepName',
                align: 'center',
                title: '工步名称',
                width: 50,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].stepName' value='%s' readonly>", index, value);
                    return html;
                }
            },
            {
                field: 'stepDesc',
                align: 'center',
                title: '工步描述',
                width: 60,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].stepDesc' value='%s' readonly>", index, value);
                    return html;
                }
            },
            {
                field: 'stageId',
                align: 'center',
                title: '工段号',
                width: 50,
                formatter: function(value, row, index) {
                    var html = $.common.sprintf("<input class='form-control' type='text' name='outsourcecomegorecord[%s].stageId' value='%s' readonly>", index, value);
                    return html;
                }
            }
        ];

        var options1 = {
            id: "bootstrap-table1",
            data: data1,
            pagination: false,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            sidePagination: "client",
            columns: columns1
        };

        $(function() {
            $.table.init(options1);
        });

        $("#form-add").validate({
            focusCleanup: true
        });

        function submitHandler(index, layero){
            if ($.validate.form()) {
                var data = $("#form-add").serializeArray();
                $.operate.saveTab(prefix + "/add", data);
            }
        }

        function addRow1() {
            var count = $("#bootstrap-table1").bootstrapTable('getData').length;
            var row = {
                index: $.table.serialNumber(count),
                lotId: "",
                partType: "",
                partName: "",
                outsourceStep: "",
                outsourceCount: "",
                chipNumber: "",
                issueNotes: "",
                stepName: "",
                stepDesc: "",
                stageId: ""
            }
            sub.addRow(row, 'bootstrap-table1');
        }

        function getWipInfo() {
            $.modal.loading("获取wip信息中");
            if ($.validate.form()) {
                var formdata = $("#form-add").serializeArray();
                $.post(prefix + "/getwipinfo", formdata, function(result) {
                    if (result.code == web_status.SUCCESS) {
                        var data = result.data;
                        var SQljson = eval( data );
                        if (SQljson.length <= 0) {
                            // 未获取到数据
                            // 设置相关框的值为空
                            setOtWipInfoNull(formdata);
                            return;
                        }
                        var outsourcecomegorecorddata = eval(formdata);
                        for (var i = 0; i < outsourcecomegorecorddata.length; i++) {
                            let name = outsourcecomegorecorddata[i].name;
                            if (name.indexOf("lotId") >= 0) {
                                for ( var j = 0; j < SQljson.length; j++) {
                                    let lotidvalue = outsourcecomegorecorddata[i].value;
                                    if (lotidvalue == SQljson[j].lotId) {
                                        let k = name.substring(0, name.indexOf("."));
                                        $("input[name='" + k + ".partType']").val(SQljson[j].partType);
                                        $("input[name='" + k + ".partName']").val(SQljson[j].partName);
                                        $("input[name='" + k + ".outsourceStep']").val(SQljson[j].outsourceStep);
                                        $("input[name='" + k + ".outsourceCount']").val(SQljson[j].outsourceCount);
                                        $("input[name='" + k + ".stageId']").val(SQljson[j].stageId);
                                        $("input[name='" + k + ".stepName']").val(SQljson[j].stepName);
                                        $("input[name='" + k + ".stepDesc']").val(SQljson[j].stepDesc);
                                        $("input[name='" + k + ".chipNumber']").val(SQljson[j].chipNumber);
                                    }
                                }
                            }
                        }
                    } else {
                        $.modal.alertError(result.msg);
                    }
                });
            }
            $.modal.closeLoading();
        }

        function setOtWipInfoNull(formdata) {
            var outsourcecomegorecorddata = eval(formdata);
            for (var i = 0; i < outsourcecomegorecorddata.length; i++) {
                let k = "outsourcecomegorecord[" + i + "]";
                $("input[name='" + k + ".partType']").val(null);
                $("input[name='" + k + ".partName']").val(null);
                $("input[name='" + k + ".outsourceStep']").val(null);
                $("input[name='" + k + ".outsourceCount']").val(null);
                $("input[name='" + k + ".chipNumber']").val(null);
                $("input[name='" + k + ".stageId']").val(null);
                $("input[name='" + k + ".stepName']").val(null);
                $("input[name='" + k + ".stepDesc']").val(null);
                $("input[name='" + k + ".issueNotes']").val(null);
            }
        }

        /* 导入外包批次 */
        function importOutsourceLot() {
            var options = {
                title: '导入外包批次',
                url: prefix + "/importoslot",
                callBack: importOutsourceLotCallBack
            };
            $.modal.openOptions(options);
        }

        /* 导入外包批次选择数据后回调 */
        function importOutsourceLotCallBack(index, layero){
            var body = $.modal.getChildFrame(index);
            var lotIds = body.find('#rowIds').val();
            $.modal.close(index);
            if ($.common.isEmpty(lotIds)) {
                return;
            }
            var data = { "ids": lotIds };
            $.modal.loading("获取wip信息中");
            $.post(prefix + "/importoslotconfirm", data, function(result) {
                if (result.code == web_status.SUCCESS) {
                    var responseData = result.data;
                    var SQljson = eval( responseData );
                    if (SQljson.length <= 0) {
                        return;
                    }
                    for ( var j = 0; j < SQljson.length; j++) {
                        if (j != 0) {
                            // 新增一行
                            addRow1();
                        }
                        let k = "outsourcecomegorecord[" + j + "]";
                        $("input[name='" + k + ".partType']").val(SQljson[j].partType);
                        $("input[name='" + k + ".partName']").val(SQljson[j].partName);
                        $("input[name='" + k + ".outsourceStep']").val(SQljson[j].outsourceStep);
                        $("input[name='" + k + ".outsourceCount']").val(SQljson[j].outsourceCount);
                        $("input[name='" + k + ".stageId']").val(SQljson[j].stageId);
                        $("input[name='" + k + ".stepName']").val(SQljson[j].stepName);
                        $("input[name='" + k + ".stepDesc']").val(SQljson[j].stepDesc);
                        $("input[name='" + k + ".chipNumber']").val(SQljson[j].chipNumber);
                        $("input[name='" + k + ".lotId']").val(SQljson[j].lotId);
                    }
                } else {
                    $.modal.alertError(result.msg);
                }
            });
            $.modal.closeLoading();
        }

    </script>
</body>
</html>